<div class="login-box">
  <div>
      <p class="login-title">电子政务实训平台</p>
      <p class="login-title-en"></p>
    <nz-spin [nzSpinning]="isSpinning" [nzTip]="'正在处理...'">
      <div class="login" *ngIf="!sign">
        <form [formGroup]="loginForm" (submit)="onLoginSubmit()">
          <div class="login-type">
            <!-- <label (click)="checkType('student')">
            <span [ngClass]="{'checked': type === 'student'}"></span>
            学生
          </label>
          <label (click)="checkType('teacher')">
            <span [ngClass]="{'checked': type === 'teacher'}"></span>
            教师
          </label>
          <label (click)="checkType('admin')">
            <span [ngClass]="{'checked': type === 'admin'}"></span>
            管理员
          </label> -->
          </div>
          <div class="login-input">
            <label>
              {{ typeText }}
            </label>
            <div class="input-box">
              <input id="username" type="text" formControlName="name">
              <div [hidden]="loginForm.get('name').valid || !loginForm.get('name').dirty">
                <p class="login-info" [hidden]="!loginForm.hasError('required','name')">
                  账号不能为空!
                </p>
                <p class="login-info" [hidden]="!loginForm.hasError('required','name')">
                  账号格式不正确!
                </p>
              </div>
            </div>
            <label>
              密码
            </label>
            <div class="input-box">
              <input id="password" type="password" formControlName="password" placeholder="请输入密码">
              <div [hidden]="loginForm.get('password').valid || !loginForm.get('password').dirty">
                <p class="login-info" [hidden]="!loginForm.hasError('required','password')">
                  密码不能为空!
                </p>
                <p class="login-info" [hidden]="!loginForm.hasError('maxlength','password')">
                  密码格式不正确!
                </p>
                <p class="login-info" [hidden]="!loginForm.hasError('minlength','password')">
                  密码格式不正确!
                </p>
              </div>
            </div>
          </div>
          <!-- <p class="login-info">
          <a href="javascript:;">忘记密码？</a>
        </p> -->
          <button class="login-btn" type="submit" *ngIf="!isSpinning">登录</button>
        </form>
        <!-- <p class="login-sign"> 还没有账号？
          <a (click)="toggle()" href="javascript:;">立即注册</a>
        </p> -->
      </div>
      <div class="sign" *ngIf="sign">
        <form [formGroup]="signForm" (submit)="onSignSubmit()">
          <div style="display: flex;">
            <div style="display:flex">
              <label style="line-height: 40px;">
                省
                <span class="required">*</span>
              </label>
              <nz-select class="getheight" style="height: 40px;width: 110px;margin-left: 20px;border-radius: 0;border-color: #eaeaea" [(ngModel)]="selectedProvince"
                [formControlName]="'selectedProvince1'" nzPlaceHolder="请选择省" nzAllowClear nzShowSearch [nzServerSearch]="true">
                <nz-option *ngFor="let p of provinceData" [nzValue]="p" [nzLabel]="p"></nz-option>
              </nz-select>
              <div [hidden]="signForm.get('selectedProvince1').valid || !signForm.get('selectedProvince1').dirty">
                <p class="sign-info" [hidden]="!signForm.hasError('required','selectedProvince1')">
                  必填选项不能为空!
                </p>
              </div>
            </div>
            <div style="display:flex">
              <label style="line-height: 40px;">
                市
                <span class="required">*</span>
              </label>
              <nz-select style="height: 40px;width:110px;margin-left: 20px;border-radius: 0;border-color: #eaeaea" nzShowSearch nzAllowClear
                nzPlaceHolder="请选择市" [formControlName]="'selectedCity1'" [(ngModel)]="selectedCity" (ngModelChange)="citygetschool($event)">
                <nz-option *ngFor="let c of cityData[selectedProvince]" [nzValue]="c" [nzLabel]="c"></nz-option>
              </nz-select>
              <div [hidden]="signForm.get('selectedCity1').valid || !signForm.get('selectedCity1').dirty">
                <p class="sign-info" [hidden]="!signForm.hasError('required','selectedCity1')">
                  必填选项不能为空!
                </p>
              </div>
            </div>
          </div>

          <div style="display: flex;">
            <label style="line-height: 40px;">
              学校
              <span class="required">*</span>
            </label>
            <nz-select style="height: 40px;width: calc(100% - 90px);margin-left: 20px;border-radius: 0;border-color: #eaeaea" nzAllowClear
              [nzPlaceHolder]="'请选择学校名称'" [formControlName]="'schoolName1'" [(ngModel)]="schoolName" (ngModelChange)="provinceChangesol($event)"
              (nzOnSearch)="searchschoolName($event)" [nzServerSearch]="true" [nzNotFoundContent]="'没有对应内容'" nzShowSearch>
              <nz-option *ngFor="let list of listEntitiesdata" [nzLabel]="list.schoolName" [nzValue]="list.id"></nz-option>
            </nz-select>
            <div [hidden]="signForm.get('schoolName1').valid || !signForm.get('schoolName1').dirty">
              <p class="sign-info" [hidden]="!signForm.hasError('required','schoolName1')">
                必填选项不能为空!
              </p>
            </div>
          </div>

          <div style="display: flex;">
            <div style="display: flex">
              <label style="line-height: 40px;">
                学院
                <span class="required">*</span>
              </label>
              <nz-select style="height: 40px;width: 110px;margin-left: 20px;border-radius: 0;border-color: #eaeaea" nzAllowClear [nzPlaceHolder]="'请选择学院名称'"
                [formControlName]="'collegelName1'" [(ngModel)]="collegelName" (ngModelChange)="getmana($event)" (nzOnSearch)="searchcollegelName($event)"
                [nzServerSearch]="true" [nzNotFoundContent]="'没有对应内容'" nzShowSearch>
                <nz-option *ngFor="let list of resultxy" [nzLabel]="list.academeName" [nzValue]="list.id"></nz-option>
              </nz-select>
              <div [hidden]="signForm.get('collegelName1').valid || !signForm.get('collegelName1').dirty">
                <p class="sign-info" [hidden]="!signForm.hasError('required','collegelName1')">
                  必填选项不能为空!
                </p>
              </div>
            </div>
            <div style="display: flex">
              <label style="line-height: 40px;">
                学系
                <span class="required">*</span>
              </label>
              <nz-select style="height: 40px;width: 110px;margin-left: 20px;border-radius: 0;border-color: #eaeaea" nzAllowClear [nzPlaceHolder]="'请选择学系名称'"
                [formControlName]="'facultydata1'" [(ngModel)]="facultydata" (ngModelChange)="facultyget($event)" (nzOnSearch)="searchfacultyget($event)"
                [nzServerSearch]="true" [nzNotFoundContent]="'没有对应内容'" nzShowSearch>
                <nz-option *ngFor="let list of resultxymana" [nzLabel]="list.collegeDepartmentName" [nzValue]="list.id"></nz-option>
              </nz-select>
              <div [hidden]="signForm.get('facultydata1').valid || !signForm.get('facultydata1').dirty">
                <p class="sign-info" [hidden]="!signForm.hasError('required','facultydata1')">
                  必填选项不能为空!
                </p>
              </div>
            </div>
          </div>
          <div style="display: flex">
            <label style="line-height: 40px;">
              班级
              <span class="required">*</span>
            </label>
            <!-- <select name="" id="" formControlName="className">
                <option [value]="item.dValue" *ngFor="let item of classInfo">
                  {{item.caption}}
                </option>
              </select> -->
            <nz-select style="height: 40px;width: calc(100% - 90px);margin-left: 20px;border-radius: 0;border-color: #eaeaea" [formControlName]="'className'"
              (nzOnSearch)="searchclassName($event)" nzPlaceHolder="请搜索要选择的班级" nzAllowClear nzShowSearch [nzServerSearch]="true">
              <ng-container *ngFor="let o of classget">
                <nz-option [nzValue]="o.id" [nzLabel]="o.className"></nz-option>
              </ng-container>
            </nz-select>
            <div [hidden]="signForm.get('className').valid || !signForm.get('className').dirty">
              <p class="sign-info" [hidden]="!signForm.hasError('required','className')">
                必填选项不能为空!
              </p>
            </div>
          </div>
          <div>
            <label style="line-height: 40px;">
              学号
              <span class="required">*</span>
            </label>
            <input type="text" formControlName="personNO">
            <div [hidden]="signForm.get('personNO').valid || !signForm.get('personNO').dirty">
              <p class="sign-info" [hidden]="!signForm.hasError('required','personNO')">
                必填选项不能为空!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('minlength','personNO')">
                学号长度最短为1位!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('maxlength','personNO')">
                学号长度最长为30位!
              </p>
            </div>
          </div>
          <div>
            <span style="font-size:15px;">真实姓名</span>
            <span class="required">*</span>
            <input type="text" [formControlName]="'personName'">
            <div [hidden]="signForm.get('personName').valid || !signForm.get('personName').dirty">
              <p class="sign-info" [hidden]="!signForm.hasError('required','personName')">
                必填选项不能为空!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('minlength','personName')">
                真实姓名长度最短为1位!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('maxlength','personName')">
                真实姓名长度最长为30位!
              </p>
            </div>
          </div>
          <div>
            <label style="line-height: 40px;">
              用户名
              <span class="required">*</span>
            </label>
            <input class="placeholdertype" placeholder="用于登入" type="text" [formControlName]="'userName'">
            <div [hidden]="signForm.get('userName').valid || !signForm.get('userName').dirty">
              <p class="sign-info" [hidden]="!signForm.hasError('required','userName')">
                必填选项不能为空!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('minlength','userName')">
                  用户名长度最短为1位!
              </p>
              <p class="sign-info" [hidden]="!signForm.hasError('maxlength','userName')">
                  用户名长度最长为30位!
              </p>
            </div>
          </div>

          <!-- <div>
            <label style="line-height: 40px;">
              性别
              <span class="required">*</span>
            </label>
            <div class="sex">
              <div (click)="checkSex('male')">
                <span [ngClass]="{'checked': sex === 'male'}"></span>
                男
              </div>
              <div (click)="checkSex('female')">
                <span [ngClass]="{'checked': sex === 'female'}"></span>
                女
              </div>
            </div>
          </div> -->

          <div class="passwordGroup" formGroupName="passwords">
            <div style="margin-bottom: 15px">
              <label style="line-height: 40px;">
                密码
                <span class="required">*</span>
              </label>
              <input type="password" formControlName="password">
              <div [hidden]="signForm.get('passwords').valid || !signForm.get('passwords').dirty">
                <p class="sign-info" [hidden]="!signForm.hasError('ensure','passwords')">
                  {{signForm.getError('ensure','passwords')?.description}}
                </p>
                <p class="sign-info" [hidden]="!signForm.hasError('maxlength',['passwords', 'password'])">
                  密码长度最长为16位!
                </p>
                <p class="sign-info" [hidden]="!signForm.hasError('required',['passwords', 'password'])">
                  必填选项不能为空!
                </p>
                <p class="sign-info" [hidden]="!signForm.hasError('minlength',['passwords', 'password'])">
                  密码长度最短为8位!
                </p>
              </div>
            </div>
            <div>
              <span style="font-size:15px;">确认密码</span>
              <span class="required">*</span>
              <input type="password" formControlName="ensurePassword">
              <p class="sign-info" [hidden]="!signForm.hasError('ensure','passwords')">
                {{signForm.getError('ensure','passwords')?.description}}
              </p>
            </div>
          </div>
          <button class="sign-btn" type="submit">注册</button>
        </form>
        <p class="login-sign"> 已有账号？
          <a (click)="toggle()" href="javascript:;">立即登录</a>
        </p>
      </div>
    </nz-spin>
  </div>
</div>
